<template>
  <div>
    <el-table :data="roles">
      <el-table-column prop="id" label="编号"> </el-table-column>
      <el-table-column prop="name" label="角色"> </el-table-column>
      <el-table-column fixed="right" label="操作" width="100">
        <template slot-scope="scope">
          <el-button type="text" size="small" @click="handleClick(scope.row.id)">配置</el-button>
        </template>
      </el-table-column>
    </el-table>
    <el-dialog title="资源配置" :visible.sync="dialogTableVisible">
        <el-transfer v-model="value" :data="lst"></el-transfer>
        <el-button @click="tj">提交</el-button>
    </el-dialog>
  </div>
</template>

<script>
export default {
    data(){
        return{
            roles:"",
            rid:"",
            dialogTableVisible:false,
            lst:[],
            value:[],
            roleid:localStorage.getItem("roleid")

        }
    },
    mounted(){
        this.getrole()
        

    },
    methods:{
        getrole(){
            this.axios.get("/getroles").then(res =>{
                this.roles = res.data.data
            })
        },
        handleClick(id){
            this.rid = id
            this.dialogTableVisible=true
            this.getresource()
        },
        getresource(){
            this.axios.get("/getresource?roleid="+this.rid).then(res =>{
                this.lst = res.data.data
                this.value = res.data.lst
            })
        },
        tj(){
            var data = {"roleid":this.rid,"resourceid":this.value}
           this.axios.post("/setres",data).then(res =>{
            alert(res.data.msg)
           })
        }
    }

}
</script>

<style>

</style>